/*
* @Author: yewenhao
* @Date:   2018-01-10 09:56:57
* @Last Modified by:   RoyceCodeForce
* @Last Modified time: 2018-01-10 14:50:23
*/
body{
    overflow-x: hidden;
    text-align: center;
    position: relative;
    width:100%;
    height:100%;
    padding:0;
    margin:0;
    background: url("../img/login_img_bg@2x.png") no-repeat center;
}
.border{
    /*width: 1920px;*/
    /*height: 1080px;*/
    color: #FFFFFF;
    /*background: url("../img/login_img_bg@2x.png") no-repeat center;*/
    /*background-color: #666666;*/
    /*background-size: 100% 100%;*/
}
.formBody{
    display: block;
    /*position: absolute;*/
    width: 600px;
    /*height: 100%;*/
    /*top: 0;*/
    /*left: 0;*/
    /*bottom: 0;*/
    /*right: 0;*/
    margin: auto;
    padding-top: 3%;
    padding-bottom:20px;
}
.inputGroup{
    /*height: 819px;*/
    border-radius: 4px;
    background: rgba(255,255,255,0.3);
    padding-bottom: 5%;
    /*padding-top: 8%;*/
}

/*circle PART*/

.circleGroup{
    height: 54px;
    position: relative;
}
.circle{
    display: inline-block;
    height: 54px;
}
.circle .outCircle{
    width: 54px;
    height: 54px;
    margin: 0 0;
    border-radius:50%;
    border: 1px solid #FFFFFF;
}
.circle .inCircle{
    display: table;
    width: 44px;
    height: 44px;
    margin:-49px 0 0 5px;
    border-radius: 50%;
    background: #FFFFFF;
}
.circle .circleNum{
    display: table-cell;
    vertical-align: middle;
    font-size: 24px;
    color: #999999;
}

.circle.active>.outCircle,.circle.active>.inCircle{
    border-color: rgb(52,132,234);
}
.circle.active>.inCircle{
    background-color: rgb(52,132,234);
}
.circle.active>.inCircle>.circleNum{
    color: #FFFFFF;
}
.circle{
    cursor: pointer;
}

.line{
    display: inline-block;
    margin: 26px -0.3em 26px -0.31em;
    /*margin-top: 26px;*/
    /*margin-bottom: 26px;*/
    /*margin-left: -0.31em;*/
    /*margin-right: -0.3em;*/
    width: 121px;
    height: 2px;
    border:1px solid #FFFFFF;
}

.subscriptionDown{
    padding-top: 7px;
}
.circleLabel{
    font-size: 18px;
}
.blackOne{
    width: 96px;
    height: 0;
    display: inline-block;
}

.input-group{
    text-align: left;
}
.pageTitle{
    margin-bottom: 40px;
    font-size: 24px;
}
.specialRow{
    position: relative;
}
.form_row{
    padding:7px 0;
    text-align: center;
    vertical-align: middle;
}
.requiredSymbol{
    color: red;
}

.formLabel{
    text-align: right;
    color:#555555;
    height: 30px;
    width: 160px;
    display: inline-block;
    vertical-align: baseline;
}

.com_inputStyle_normal{
    text-align: left;
    height: 30px;
    width:330px;
    border:1px solid #FFFFFF;
    background: transparent;
    line-height: 30px;
    border-radius: 4px;
    padding-left:15px;
    font-size:14px;
    outline: none;
}
/*filePack->( packFrame->i+span ) + businessLicense*/

/*.specialFormLabel{*/
/*position: absolute;*/
/*top: 9px;*/
/*left: 53px;*/
/*height: 100px;*/
/*}*/
.box1{
    float: left;
    width: 100px;
    display: inline-block;
}
.box2{
    display: inline-block;
    width: 100px;
}
.specialLabel{
    float: left;
    width: 211px;
}
.fileWrap{
    width: 372px;
    position: relative;
    display: inline-block;
}
.hint2{
    width: 100px;
    text-align: center;
    display: block;
    padding-bottom: 19px;
}
.filePack{
    position: relative;
    text-align: center;
    padding-left: 0;
    width: 100px;
    height: 100px;
}
.packFrame{
    position: relative;
    text-align: center;
    border:1px  dashed #FFFFFF;
    width: 100px;
    height: 100px;
}
.fileUpLoad,.preview_box{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
}
.preview_box{
    opacity: 100;
}
.preview_box img{
    width: 100%;
    height: 100%;
}
.AddSymbol{
    position: relative;
}
.AddSymbol .horizontal{
    position: absolute;
    top: 14px;
    left: -1px;
    right: 0;
    background: #FFFFFF;
    height: 2px;
    width: 30px;
}
.AddSymbol .vertical{
    position: absolute;
    top: 0;
    left: 13px;
    right: 0;
    background: #FFFFFF;
    height: 30px;
    width: 2px;
}
.packFrame>.AddSymbol{
    position: absolute;
    top: 21px;
    left: 35px;
    right: 0;
}
.packFrame>span{
    position: absolute;
    top: 70px;
    left: 5px;
    right: 5px;
    font-size: 12px;
}
.fileWrap .hint1{
    position: absolute;
    top: 45px;
    left: 120px;
    font-size: 12px;
}
.verification_codeInput{
    width: 220px;
}

.getCodeBtn{
    font-size: 12px;
    margin-left: 23px;
}

.alreadyReg{
    display: inline-block;
    padding-bottom: 15px;
    color: #555555;
}
.loginDirect{
    color: #FFFFFF;
}
.loginDirect:link{
    text-decoration: underline;
}
.loginDirect:visited,loginDirect:hover{
    text-decoration: none;
}
.bottomBtn{
    width: 450px;
    height: 60px;
    font-size: 20px;
}
.clear{
    clear: both;
}
.subScript{
    margin-top: 39px;
    text-align: center;
}
#btnRegisterDirect,#btnNext{
    background-image: -webkit-linear-gradient(to right, #3E7BE8, #229FE0);
    background-image: linear-gradient(to right, #3E7BE8, #229FE0);
    border: none;
}
#btnGetCode1{
    background-color: #1577E4;
    text-align: center;
    border: none;
}
#btnGetCode1.active{
    background-color: grey;
    font-size: 10px;
    margin-left: 23px;
    width: 140px;
    cursor: auto;
}
.part{
    padding-top: 41px;
}
.part.active{
    display: inline-block;
}
.part{
    display: none;
}
.bottomBtn.active{
    display: block;
    margin: auto;
}
.bottomBtn{
    display: none;
}

/*#telephoneNumber.warn{*/
/*border-color: red;*/
/*}*/
#register_alert_box #confirm_btn{
    position: absolute;
    top: 60%;
    left: 87%;
}
#register_alert_box{
    background: #fff;
    color: #333;
    position: absolute;
    height: 120px;
    width: 500px;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin:auto;
    overflow-y: hidden;
}
#register_alert_box.active{
    display:block;
}
.warn{
    border-color: #ff0000;
}
#partOne input.warn::-webkit-input-placeholder{
    color: #ff0000;
}

/*#partOne input::-webkit-input-placeholder{*/
    /*color: #fff;*/
/*}*/

/***/
body{
    /*width:100%;*/
    /*height:100%;*/
    width:100vw;
    height:100vh;
    padding:0;
    margin:0;
    background: url("../img/bg.jpg") no-repeat;
    position: relative;
}

section{
    width: 600px;
    height: 550px;
    border-radius: 4px;
    overflow: hidden;
    background-color: #fff;
    position: absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    margin:auto;
}
#top{
    width:100%;
    height:145px;
    background-color: #E26F6F;
    position: relative;
}
#top .top_logo{
    display: block;
    vertical-align: middle;
    width: 201px;
    height:69px;
    background: url("../img/top_logo.png") no-repeat center;
    position: absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    margin:auto;
}

input{
    border-color:#d9d9d9!important;
    color: #333!important;
    font-size: 13px !important;
}
#login_btn{
    width:163px;
    height:34px;
    border-radius: 17px;
    border: none;
    background-color: #E26F6F;
    text-align: center;
    display: block;
    margin:10px auto 0;
    color: #F3F9FF;
    font-size:14px;
    outline: none;
    cursor: pointer;
}
#btnGetCode1{
    height:30px;
    color: #F3F9FF;
    background-color: #E26F6F;
    border-radius: 4px;
    border: none;
    outline: none;
    cursor: pointer;
}
.alreadyReg>a{
    color: #e26f6f;
}
.input_text{
    color: #666;
    font-size:14px;
}
::-webkit-input-placeholder { /* WebKit browsers */
    color: #aaa;
    font-size:13px;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #aaa;
    font-size:13px;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #aaa;
    font-size:13px;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #aaa;
    font-size:13px;
}
/*错误*/
input.error::-webkit-input-placeholder { /* WebKit browsers */
    color: #ff0000;
    font-size:13px;
}
input.error:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #ff0000;
    font-size:13px;
}
input.error::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #ff0000;
    font-size:13px;
}
input.error:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #ff0000;
    font-size:13px;
}
input.error{
    border-color: #ff0000!important;
}